@charset "utf-8";

/**************************
/* グリッド
**************************/
.gridWrapper{
clear:both;
padding:20px 0;
overflow:hidden;
background:#EEFFFF;
}

* html .gridWrapper{height:1%;}

.grid{
	width: 100%;
	float:left;
	/*	background:#EEEEEE;*/
		/* background:white; */
		background:#EEFFFF;
}

.gridL{
	float:right;
	width: 370px;
	/*	background:#EEEEEE;*/
		/* background:white; */
		/*	font-family:"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; */
		/* font-family: inherit; */
		font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:12px;
	background:#EEFFFF;
}
.gridL2{
		margin: 0 auto;
	width: 600px;
	  padding: 0.5px 0.5px 0.5px;
	/*	background:#EEEEEE;*/
		/* background:white; */
		/*	font-family:"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; */
		/* font-family: inherit; */
		font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:20px;
	background:#EEFFFF;
}

.gridL ul {
  /* border: solid 2px #ffb03f; */
  /* padding: 0 0.1em; */
  /* position: relative; */
	margin: 0 0 0 0;
	padding: 0;
	text-indent: -1.2em;
	padding-left: 1em;
}
.gridL2 ul {
  /* border: solid 2px #ffb03f; */
  /* padding: 0 0.1em; */
  /* position: relative; */
	margin: 0 0 0 0;
	padding: 0;
	text-indent: -1.2em;
	padding-left: 1em;
}

.gridL ul li {
  line-height: 1.5;
  padding: 0.5em 0.5em 0.5em;
  border-bottom: dashed 1px silver;
  /* list-style-type: none!important; */
}
.gridL2 ul li {
  line-height: 1.5;
  padding: 0.5em 0.5em 0.5em;
  border-bottom: dashed 1px silver;
  /* list-style-type: none!important; */
}

.gridL ul li:before {
  /* font-family: "Font Awesome 5 Free"; */
  /* content: "\f138";/*アイコン種類*/ */
  /* position: absolute; */
  /* left : 0.5em; /*左端からのアイコンまで*/ */
  /* color: #ffb03f; /*アイコン色*/ */
}
.gridL2 ul li:before {
  /* font-family: "Font Awesome 5 Free"; */
  /* content: "\f138";/*アイコン種類*/ */
  /* position: absolute; */
  /* left : 0.5em; /*左端からのアイコンまで*/ */
  /* color: #ffb03f; /*アイコン色*/ */
}

.gridL ul li:last-of-type{
  /* border-bottom: none; */
}
.gridL2 ul li:last-of-type{
  /* border-bottom: none; */
}


.gridR{
	clear: both;
	float:left;
	width: 370px;
	/*	background:#EEEEEE;*/
		/* background:white; */
		background:#EEFFFF;

		/*	font-family:"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; */
		/* font-family: inherit; */
		font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-size:12px;
}
.gridR2{
	clear: both;

		margin: 0 auto;
	width: 600px;
	/*	background:#EEEEEE;*/
		/* background:white; */
		background:#EEFFFF;

		/*	font-family:"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; */
		/* font-family: inherit; */
		font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
		font-size:20px;
}



.gridR img{
	padding: 10px 20px;
	width: 90%;
	margin: 0 auto;
}
.gridR2 img{
	padding: 10px 150px;
	width: 50%;
	margin: 0 auto;
}

.gridR ul {
  /* border: solid 2px #ffb03f; */
  /* padding: 0 0.1em; */
  /* position: relative; */

	margin: 0 0 0 0;
	padding: 0;
	text-indent: -1.2em;
	padding-left: 1em;

}
.gridR2 ul {
  /* border: solid 2px #ffb03f; */
  /* padding: 0 0.1em; */
  /* position: relative; */

	margin: 0 0 0 0;
	padding: 0;
	text-indent: -1.2em;
	padding-left: 1em;

}


.gridR ul li {
  line-height: 1.5;
  padding: 0.5em 0.5em 0.5em;
  border-bottom: dashed 1px silver;
  /* list-style-type: none!important; */
}

.gridR2 ul li {
  line-height: 1.5;
  padding: 0.5em 0.5em 0.5em;
  border-bottom: dashed 1px silver;
  /* list-style-type: none!important; */
}

.gridR ul li:before {
  /* font-family: "Font Awesome 5 Free"; */
  /* content: "\f138";/*アイコン種類*/ */
  /* position: absolute; */
  /* left : 0.5em; /*左端からのアイコンまで*/ */
  /* color: #ffb03f; /*アイコン色*/ */
}
.gridR2 ul li:before {
  /* font-family: "Font Awesome 5 Free"; */
  /* content: "\f138";/*アイコン種類*/ */
  /* position: absolute; */
  /* left : 0.5em; /*左端からのアイコンまで*/ */
  /* color: #ffb03f; /*アイコン色*/ */
}

.gridR ul li:last-of-type{
  /* border-bottom: none; */
}
.gridR2 ul li:last-of-type{
  /* border-bottom: none; */
}

.grid p{
padding:5px 10px;
}
.gridL p{
	padding:5px 10px;
}
.gridL2 p{
	padding:5px 10px;
}
.gridR p{
	padding:5px 10px;
}
.gridR2 p{
	padding:5px 10px;
}

.grid ul{margin:5px 10px;}
.gridL ul{margin:5px 10px;}
.gridL2 ul{margin:5px 10px;}
.gridR ul{margin:5px 10px;}
.gridR2 ul{margin:5px 10px;}

.grid li{
	padding:5px 0;
	list-style:inside;
	border-bottom:1px dashed #ebebeb;
}

.gridL li{
	padding:5px 0;
	list-style:inside;
	border-bottom:1px dashed #ebebeb;
	text-indent: -1.5em;
	padding-left: 1.0em;
}
.gridL2 li{
	padding:5px 0;
	list-style:inside;
	border-bottom:1px dashed #ebebeb;
	text-indent: -1.5em;
	padding-left: 1.0em;
}

.gridR li{
	padding:5px 0;
	list-style:inside;
	border-bottom:1px dashed #ebebeb;
	text-indent: -1.5em;
	padding-left: 1.0em;
}
.gridR2 li{
	padding:5px 0;
	list-style:inside;
	border-bottom:1px dashed #ebebeb;
	text-indent: -1.5em;
	padding-left: 1.0em;
}

.gridWrapper img{
	max-width:100%;
	height:auto;
}

/*************
メイン コンテンツ
*************/
section.content{
	margin-bottom:20px;
	font-size:14px;
	overflow:hidden;
}

* html section.content{height:1%;}

section.content p{margin-bottom:5px;}

section.gridWrapper{
	/* background:gray; */
}


h3.heading,#sub .grid h3{
	padding:5px 10px;
	padding-top:7px;
	margin-bottom:10px;
	font-size:17px;
	border-left:7px solid #143572;
	background:#6699CC;
}

.grid h3{
	padding:5px 10px;
	padding-top:7px;
	margin-bottom:10px;
	font-size:17px;
	border-left:7px solid #143572;
	color: #FFFFFF;
	background: #6699CC;
	/* font-family: inherit; */
	font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.grid h3{margin-right:10px;}

.gridL h3{
	padding:5px 10px;
	padding-top:7px;
	margin-bottom:10px;
	font-size:17px;
	border-left:7px solid #143572;
	color: #FFFFFF;
	background: #6699CC;
	/* font-family: inherit; */
	font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.gridL2 h3{
	padding:5px 10px;
	padding-top:7px;
	margin-bottom:10px;
	font-size:30px;
	border-left:7px solid #143572;
	color: #FFFFFF;
	background: #6699CC;
	/* font-family: inherit; */
	font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.gridR h3{
	padding:5px 10px;
	padding-top:7px;
	margin-bottom:10px;
	font-size:17px;
	background: #6699CC;
	border-left:7px solid #143572;
	color: #FFFFFF;
	/* font-family: inherit; */
	font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.gridR2 h3{
	padding:5px 10px;
	padding-top:7px;
	margin-bottom:10px;
	font-size:30px;
	background: #6699CC;
	border-left:7px solid #143572;
	color: #FFFFFF;
	/* font-family: inherit; */
	font-family:"HG丸ゴシックM-PRO", "メイリオ","Meiryo", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}


/*************
製品案内のスライドショー　PC　20220415佐藤追加
*************/

.slider_fade {
    position: relative;
}

.slider_fade > li {
    position: absolute;
    list-style: none;
    visibility: hidden;
		margin: auto;
    animation: anime_slider_fade 40s 0s infinite;
}
.slider_fade > li:nth-of-type(1) {
    animation-delay: 0s;
}
.slider_fade > li:nth-of-type(2) {
    animation-delay: 6s;
}
.slider_fade > li:nth-of-type(3) {
    animation-delay: 12s;
}
.slider_fade > li:nth-of-type(4) {
    animation-delay: 18s;
}
.slider_fade > li:nth-of-type(5) {
    animation-delay: 24s;
}
.slider_fade > li:nth-of-type(6) {
    animation-delay: 30s;
}

@keyframes anime_slider_fade {
    0% {
        visibility: visible;
        opacity: 0;
    }
    16.6% {
        opacity: 0;
    }
　  20% {
        opacity: 0;
    }
    30% {
        opacity: 0;
    }
		40% {
				opacity: 0;
		}
    100% {
        opacity: 0;
    }
}
/*************
製品案内のスライドショー　Mobile（jsはなし）　20220415佐藤追加
*************/

.slider_fade2 {
	clear:both;
	padding:10px 0px;
	overflow:hidden;
	background:#FFFFFF;
	width: 600px;
	margin: 0 auto;
}

.slider_fade2 > li {
    position: absolute;
    list-style: none;
    visibility: hidden;
		margin: auto;
    animation: anime_slider_fade 40s 0s infinite;
}
.slider_fade2 > li:nth-of-type(1) {
    animation-delay: 0s;
}
.slider_fade2 > li:nth-of-type(2) {
    animation-delay: 6s;
}
.slider_fade2 > li:nth-of-type(3) {
    animation-delay: 12s;
}
.slider_fade2 > li:nth-of-type(4) {
    animation-delay: 18s;
}
.slider_fade2 > li:nth-of-type(5) {
    animation-delay: 24s;
}
.slider_fade2 > li:nth-of-type(6) {
    animation-delay: 30s;
}

@keyframes anime_slider_fade {
    0% {
        visibility: visible;
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
　  15% {
        opacity: 0;
    }
    60% {
        opacity: 0;
    }
		80% {
				opacity: 0;
		}
    100% {
        opacity: 0;
    }
  }